 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 <html>
   <head>
     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	 <script>
      Timeline_ajax_url="<?php echo ABS_PATH; ?>_js/timeline/timeline_ajax/simile-ajax-api.js";
      Timeline_urlPrefix='<?php echo ABS_PATH; ?>_js/timeline/timeline_js/';       
      Timeline_parameters='bundle=true';
      </script>
     <script src="_js/timeline/timeline_js/timeline-api.js" type="text/javascript"> </script>
	 <script type="text/javascript">
	  var tl;
 function onLoad() {
   var eventSource = new Timeline.DefaultEventSource();
   var bandInfos = [
     Timeline.createBandInfo({
         eventSource:    eventSource,
         date:           "<?php echo date("r", strtotime($res_com['Date_Commande'])); ?>",
         width:          "60%",
         intervalUnit:   Timeline.DateTime.WEEK, 
         intervalPixels: 100,
		 eventSource:    eventSource,
            zoomIndex:      1,
            zoomSteps:      new Array(
			{pixelsPerInterval: 100,  unit:Timeline.DateTime.DAY},
			{pixelsPerInterval: 100,  unit:Timeline.DateTime.WEEK}
		),
     }),
	     Timeline.createBandInfo({
		 overview: true,
         eventSource:    eventSource,
         date:           "<?php echo date("r", strtotime($res_com['Date_Commande'])); ?>",
         width:          "40%", 
         intervalUnit:   Timeline.DateTime.MONTH, 
         intervalPixels: 200
     })
   ];
   bandInfos[1].syncWith = 0;
   bandInfos[1].highlight = true;
   
   tl = Timeline.create(document.getElementById("my-timeline"), bandInfos);
   Timeline.loadXML("_fct/generate.php?id=<?php echo $_GET['idcom']; ?>", function(xml, url) { eventSource.loadXML(xml, url); });
 }

 var resizeTimerID = null;
 function onResize() {
     if (resizeTimerID == null) {
         resizeTimerID = window.setTimeout(function() {
             resizeTimerID = null;
             tl.layout();
         }, 500);
     }
 }
	 </script>
   </head>
   <body onload="onLoad();" onresize="onResize();">
 <center>
   <div id="my-timeline" style="height: 100px; width: 80%; border: 1px solid #aaa"></div>
	<noscript>
	This page uses Javascript to show you a Timeline. Please enable Javascript in your browser to see the full page. Thank you.
	</noscript>
</center>
   </body>
 </html>